<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>批量加载图片</title>
</head>
<body>
    <div id="url_input">
        请输入你要打开的图片的链接:
        <input type="text" id="input_url">
    </div>
    <div id="pages_input">
        请输入你要打开的图片的最大序号:
        <input type="text" id="input_pages">
    </div>
    <input id="ok_button" type="button" value="点击开始查询" onclick="search()">
    <div id="image"></div>
    <script>
        function autopages(input_url){
            if(document.getElementById("input_pages").value==""){
                var number= input_url.match(/\/\d*\./);
                document.getElementById("input_pages").value= Number(String(number).slice(1,-1));
            }
        }
        function cuturl(input_url){
            var url= input_url.split(/\/\d*\./);
            url[0]+='/';
            url[1]='.'+url[1];
            return url;
        }
        function insertImage(divid,src,index){
            var myImg=document.createElement("img");
            myImg.src=src;
            var myP=document.createElement("p");
            myP.innerText=index;
            var myDiv=document.getElementById(divid);
            myDiv.appendChild(myImg);
            myDiv.appendChild(myP);

        }
        function search(){
            var input_url=document.getElementById("input_url").value;
            if(input_url==""){
                alert("您的输入为空");
            }else{
                autopages(input_url);
                var url=cuturl(input_url);
                var pages_value=document.getElementById("input_pages").value;
                if(pages_value<10){
                    for(var i=1;i<=pages_value;i++){
                        insertImage("image",url[0]+"0"+i+url[1],i);
                    }
                }else{
                    for(var i=1;i<10;i++){
                        insertImage("image",url[0]+"0"+i+url[1],i);
                    }
                    for(var i=10;i<=pages_value;i++){
                        insertImage("image",url[0]+i+url[1],i);
                    }
                }
            }
        }
    </script>
</body>
</html>